<template>
  <!-- 内容区域 -->
  <div class="vote_page">
    <LoginBox :userInfo="store.userInfo"/>
    <CenterList/>
    <template v-if="showEnroll">
      <div class="add_box t-center" @click="jumpEnroll('add')">
        <van-icon name="add-o" size="1.8rem" />
        <span class="ml05">作为候选项参与活动，上传信息</span>
      </div>
      <div class="f16 list_title">上传报名信息列表：</div>
      <List
        v-model:loading="loading"
        :finished="finished"
        :immediate-check="false"
        class=""
        finished-text="没有更多了"
      >
        <div class="vote_list">
          <span class="w3">序号</span><span class="name">名称</span
        ><span class="w5">得票数</span><span class="w5">状态</span
        ><span class="w4">操作</span>
        </div>
        <div v-for="(item, index) in list" :key="index" class="vote_list">
          <span class="w3">{{ index + 1 }}</span>
          <span class="name">{{ item.voteEnrollName }}</span>
          <span class="w5">{{ item.voteNum || 0 }}</span>
          <span class="w5">{{ emus[item.status] }}</span>
          <span
            v-if="[4, 5].includes(Number(item.status))"
            class="w4"
            @click="jumpEnroll('view', item)"
          >详情</span
          >
          <span
            v-if="[1, 2, 3].includes(Number(item.status))"
            class="w4"
            @click="jumpEnroll('update', item)"
          >编辑</span
          >
        </div>
      </List>
    </template>
  </div>
  <VoteNav />
  <!-- 底部弹出 -->
  <AuthPopup v-model="showBottom" @allow="allow()" />
</template>
<script setup>
import AuthPopup from "@/components/AuthPopup/index.vue";
import { apiCheckToken } from "@/server/business/survey.js";
import { getMyEnrollList } from "@/server/business/vote.js";
import { setWeappToken } from "@/utils/auth.js";
import { getUrlQuery } from "@/utils/common.js";
import { List, showNotify } from "vant";
import { computed, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { store } from "./components/store.js";
import VoteNav from "./components/voteNav.vue";
import LoginBox from "@/components/loginBox/loginBox.vue";
import CenterList from '@/components/centerList/index.vue'

const useQuery = getUrlQuery(); // url获取数据
const userInfo = ref(store.userInfo);
const router = useRouter();
const route = useRoute();
const list = ref([]);
const loading = ref(true);
const finished = ref(false);
const showBottom = ref(false);
const emus = {
  1: "待审批",
  2: "审批中",
  3: "已退回",
  4: "已审批",
  5: "已发布",
};
const showEnroll = computed(() => {
  return (
    store.voteInfo.appBizVoteEnrollConfig.isEnroll === "Y" &&
    store.voteInfo.appBizVoteSetting.voteType === "normal" &&
    store.userInfo.pkMember
  );
});
// 获取报名列表, userId: userInfo.value.pkMember
const getMyEnroll = () => {
  getMyEnrollList({
    voteId: route.query.id,
    userId: userInfo.value.pkMember,
  }).then((res) => {
    list.value = res.data;
    loading.value = false; // 加载状态结束
    finished.value = true; // true 数据全部加载完成
  });
};
// 获取登录者信息
const getUserInfo = async () => {
  return new Promise((resolve, reject) => {
    if (
      !useQuery.token ||
      ["#token%23", "#token#"].includes(useQuery.token) ||
      userInfo.value.pkMember
    ) {
      resolve();
    } else {
      setWeappToken(useQuery.token);
      apiCheckToken({ memberUserToken: useQuery.token })
        .then((res) => {
          localStorage.userInfo = JSON.stringify(res.data);
          for (let key in res.data) {
            userInfo.value[key] = res.data[key];
          }
          resolve();
        })
        .catch((msg) => reject(msg));
    }
  });
};
// 初始化
const init = () => {
  getUserInfo().then(() => {
    if (userInfo.value.pkMember) {
      getMyEnroll();
    }
  });
};
init();
// 跳转报名页面
const jumpEnroll = (type, row = {}) => {
  if (route.query.pageType === "view")
    return showNotify({ type: "success", message: "预览查看" }); // 预览不可以进行投票
  if (type === "add") {
    showBottom.value = true;
  } else {
    router.push({
      name: "VoteEnrollInfo",
      query: { ...route.query, type, voteEnrollId: row.voteEnrollId },
    });
  }
};
// 去新增
const allow = () => {
  router.push({
    name: "VoteEnrollInfo",
    query: { ...route.query, type: "add", voteEnrollId: "" },
  });
};
</script>
<style scoped>
.vote_page {
  background: var(--van-gray-1);
  overflow-y: auto;
}

.add_box {
  background: #ffffff;
  border-radius: 4px;
  margin: 1.5rem;
  padding: 2.3rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vote_list {
  display: flex;
  align-items: center;
  background: #ffffff;
  border-top: 1px solid var(--van-gray-3);
}

.vote_list .name {
  flex: 1;
}

.vote_list span {
  padding: 1.4rem 0 1.4rem 1rem;
}

.vote_list span:first-child {
  padding-left: 1.5rem;
}

.list_title {
  background: #ffffff;
  padding: 1.5rem;
}
</style>
